<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<!--bootstrap引用-->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!--<script	 src="../../static/css/header.css" th:href=@{/css/header.css}></script>-->
<link rel="stylesheet" type="text/css" href="../../static/css/header.css" th:href="@{/css/header.css}">

<script src="../../static/js/header.js" th:src="@{/js/header.js}"></script>


<div th:fragment="header">
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal-xiangfa" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">×
					</button>
					<h4 class="modal-title" id="myModalLabel-xiangfa" style="margin: 0 auto;">
						写想法
					</h4>
				</div>
				<div class="modal-body">
					<form role="form" method="post" action="还没写">
						<div class="form-group">
							<div class="form-group">
								<!--<label for="name" class="col-sm-2 control-label">描述</label>-->
								<div class="col-sm-10" style="width: 100%">
									<div id="editor-area-1" ></div>
									<div id="editor-tools-1"></div>
								</div>
							</div>
						</div>
						<input name="xiangfa-content" id="xiangfa-content" hidden="ture">
						<div class="" style="margin-left:220px;padding:10px;margin-top: 50px;">
							<button type="button" class="btn btn-default"
									data-dismiss="modal">关闭
							</button>
							<button type="submit" id="xiangfa-submit" class="btn btn-primary">
								发布想法
							</button>
						</div>
					</form>
				</div>

			</div><!-- /.modal-content -->
		</div><!-- /.modal-dialog -->
	</div><!-- /.modal -->
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<form class="form-horizontal" method="post" role="" action="/addQuestion">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title" id="myModalLabel">
							提问
						</h4>
					</div>
					<div class="modal-body">

						<div class="form-group">
							<label for="questiontitle" class="col-sm-2 control-label">问题</label>
							<div class="col-sm-10">
								<input name="questionname" type="text" class="form-control" id="questiontitle" placeholder="请输入问题">
							</div>
						</div>
						<div class="form-group">
							<label for="name" class="col-sm-2 control-label">描述</label>
							<div class="col-sm-10">
								<div id="editor-tools"></div>
								<div id="editor-area"></div>
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-2 col-sm-10">
								<div class="checkbox">
									<label>
										<input id="anonymous-cb" type="checkbox" >匿名提问
									</label>
								</div>
							</div>
						</div>


					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button id="submit" type="submit"  class="btn btn-default" >提交问题</button>
					</div>
					<!-- 提交的内容 -->
					<input id="questiondescribe" name="questiondescribe" hidden="true">
					<input id="anonymous" name="anonymous" hidden="true">
					<input id="userid" name="id" hidden="true">
				</form>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	<div class="header-window">

		<div class="header-content" state="0">
			<div class="header1">
				<div class="container-fluid">
					<div class="navbar-header navbar-left">
						<a class="navbar-brand" href="/">知乎</a>
					</div>
					<div>
						<ul class="nav navbar-nav navbar-left">
							<li class="active"><a href="/">首页</a></li>
							<li><a href="/discoveryPage">发现</a></li>
							<li><a href="/waitAnswerPage">等你来答</a></li>
							<li>
								<form action="/queryQuestion" class="navbar-form " role="search">
									<div class="form-group">
										<input name="question" type="text" style="width:300px;" class="form-control"
											   placeholder="Search">
									</div>
								</form>
							</li>
							<li>
								<button class="btn btn-default question-button" data-toggle="modal"
										data-target="#myModal">提问</button></li>

						</ul>
						<div class="user-info" style="width:300px;height:100%;float: left;">
							<div class="dropdown" style="width:40px;height:40px;float: right;margin-top: 5px;">
								<a class="dropdown-toggle" data-toggle="dropdown" href="#">
									<img style="width:40px;height:40px;" src="images/icon-dp.png"
										 th:each="cookie :${#httpServletRequest.getCookies()}"
										 th:if="${cookie.getName().equals('zhihuid')}"
										 th:src="@{'/img/upfile/'+${cookie.getValue()}+'dp.jpg'}"
										 class="icon-dp">
								</a>

							</div>
							<a href="/message.html"><div class="top-icon"><img style="width:20px;height:20px;" src="/images/Message.png"
																			   th:src="@{/images/Message.png}" class="Message"> </div></a>
							<div class="top-icon"><img style="width:20px;height:20px;" src="/images/bell.png"
													   th:src="@{/images/bell.png}" class="bell"></div>
						</div>
					</div>
				</div>
			</div>

			<div class="header2">
				<div class="container-fluid">
					<div class="navbar-header">
						<a class="navbar-brand" href="#">知乎</a>
					</div>
					<div>
						<ul class="nav navbar-nav ">
							<li class="active"><a href="#">推荐</a></li>
							<li><a href="#">关注</a></li>
							<li><a href="#">热榜</a></li>
						</ul>
						<button class="btn btn-default question-button navbar-l  navbar-right" data-toggle="modal"
								data-target="#myModal">提问</button>
						<form class="navbar-form navbar-right" style="float: right;" role="search">
							<div action="/queryQuestion" class="form-group">
								<input type="text" name="question" style="width:300px;" class="form-control" placeholder="Search">
							</div>

						</form>

					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- <ul >
        <li><a href="#">Swing</a></li>
        <li><a href="#">jMeter</a></li>
        <li><a href="#">EJB</a></li>
    </ul> -->


	<script src="../../static/js/wangEditor.min.js" th:src="@{/js/wangEditor.min.js}"></script>
	<script type="text/javascript">
		$('.dropdown').click(function () {
			window.location.href="/myself";
		});
		var E = window.wangEditor;
		// var editor = new E('#editor-tools', '#editor-area')
		// 或者 var editor = new E( document.getElementById('editor') )
		var editor = new E('#editor-tools', '#editor-area');
		editor.customConfig.menus = [
			'head',
			'bold',
			'italic',
			'underline',
			'image',
			'video'
		]
		// 配置服务器端地址
		editor.customConfig.uploadImgServer = '/upload'
		// 将图片大小限制为 3M
		editor.customConfig.uploadImgMaxSize = 3 * 1024 * 1024;
		// 自定义上传参数
		editor.customConfig.uploadFileName = 'file';
		editor.customConfig.uploadImgHooks = {
			// 如果服务器端返回的不是 {errno:0, data: [...]} 这种格式，可使用该配置
			// （但是，服务器端返回的必须是一个 JSON 格式字符串！！！否则会报错）
			customInsert : function(insertImg, result, editor) {
				// 图片上传并返回结果，自定义插入图片的事件（而不是编辑器自动插入图片！！！）
				// insertImg 是插入图片的函数，editor 是编辑器对象，result 是服务器端返回的结果
				// 举例：假如上传图片成功后，服务器端返回的是 {url:'....'} 这种格式，即可这样插入图片：
				var url = result.url
				insertImg(url)
				// result 必须是一个 JSON 格式字符串！！！否则报错
			}
		}
		// 必须放到有关于编辑器设置前面
		editor.create();

		document.getElementById('submit').addEventListener('click', function () {
			// 读取 html
			// alert(editor.txt.html())
			$("#questiondescribe").attr("value",editor.txt.html());
			if($("#anonymous-cb").prop("checked")==true){
				$("#anonymous").attr("value",1);
			}else{
				$("#anonymous").attr("value",0);
			}
			// $("#userid").attr("value",$.cookie('zhihuid'));
			// alert($("#anonymous").attr("value"));
			// $(".form-horizontal").submit();
		}, false)


	</script>

</div>



</html>